import * as obj from '../public.js';
import { cookie } from '../../public/cookieFnNew.js';
import { ajax } from '../../public/promiseAjax.js';
import { ajaxCart } from './sendCartAjax.js';

const o = obj.default;
const petU = cookie.getCookie('petUserD') ? cookie.getCookie('petUserD') : '';
// console.log(petU)
const allCheck = o.$('#allCheck')
const sum = o.$('#sum')
const sumPrice = o.$('#sumPrice')
const tbody = o.$('tbody')
if (petU) {
  let userTel;
  petU.split(',').forEach(val => {
    const a = val.split(':');
    if (a[0] === 'tel') {
      userTel = a[1]
    }
  })
    ; (async () => {
      const first = await ajax({
        url: 'http://10.11.55.120:3000/getUser',
        method: 'get',
        data: {
          userTel,
        },
      }).then(res => {
        return JSON.parse(res).data
      })
      // 初始化购物车数据
      let str = '';
      first.forEach(val => {
        str += `<tr data-id="${val.id}">
        <td><input type="checkbox" class='check'></td>
        <td><img src="${val.imgs}" alt=""></td>
        <td>${val.name}</td>
        <td><input type="number" value="${val.num}" class="Num"></td>
        <td class='price'>${val.pricec}</td>
        <td class='oneAllprice'>${val.pricec * val.num}</td>
        <td class='del'>删除</td>
      </tr>`
      })
      // 添加到页面
      tbody.innerHTML = str
      // 获取所有的单选按钮
      const check = [...o.$$('.check')]
      check.forEach((val, idx) => [
        val.checked = first[idx].check
      ])
      // 获取所有的数量按钮
      const Num = [...o.$$('.Num')];
      // 获取所有删除单个按钮
      const del = [...o.$$('.del')];
      // 获取所有单选状态为true的数量
      let allNum = 0;
      Num.forEach((data, idx) => {
        if (check[idx].checked) {
          allNum += data.value - 0
        }
      })
      // 设置总数量的 num
      sum.innerText = allNum



      // 获取所有的状态为true 的数据的总价格
      const price = [...o.$$('.price')]
      let allPrice = 0;
      check.forEach((val, idx) => {
        if (val.checked) {
          allPrice += price[idx].innerText * Num[idx].value
        }
      })
      // 设置总价
      sumPrice.innerText = allPrice


      // 根据所有的单选按钮状态 设置 全选按钮
      allCheck.checked = check.every(val => {
        return val.checked
      })

      allCheck.onclick = function () {
        // 根据全选按钮改变单选按钮状态
        const num = [...o.$$('.Num')];
        check.forEach(val => {
          val.checked = allCheck.checked
        })
        first.forEach(val => {
          val.check = allCheck.checked
        })
        // 根据全选按钮改变单选按钮状态
        if (allCheck.checked) {
          // 获取所有的单选按钮
          const check = [...o.$$('.check')]
          // 获取所有的数量按钮
          const Num = [...o.$$('.Num')];
          sum.innerText = Num.reduce((prev, val) => {
            return prev + (val.value - 0)
          }, 0)

          allPrice = check.reduce((prev, val, idx) => {
            if (val.checked) {
              return prev + price[idx].innerText * Num[idx].value
            }
          }, 0)
          sumPrice.innerText = allPrice
          // console.log(JSON.stringify(first))
          ajaxCart(userTel, first)
        } else {
          sum.innerText = 0;
          sumPrice.innerText = 0;
          ajaxCart(userTel, first)
        }
      }
      console.log(check);
      console.log(Num);
      console.log(del);
      console.log(price)

      check.forEach((val, idx) => { val.index = idx })
      Num.forEach((val, idx) => { val.index = idx })
      del.forEach((val, idx) => { val.index = idx })
      price.forEach((val, idx) => { val.index = idx })
      tbody.addEventListener('click', function (eve) {
        const e = eve || window.event;
        const target = e.target || e.srcElement;
        // 点击单选改变数据
        if (target.className === 'check') {
          // 重新获取元素 删除了不会重新获取，添加索引

          const check = [...o.$$('.check')];
          const Num = [...o.$$('.Num')];
          const del = [...o.$$('.del')];
          const price = [...o.$$('.price')];
          check.forEach((val, idx) => { val.index = idx })
          Num.forEach((val, idx) => { val.index = idx })
          del.forEach((val, idx) => { val.index = idx })
          price.forEach((val, idx) => { val.index = idx })

          const idx = target.index;
          check[idx].checked = target.checked;
          first[idx].check = target.checked;
          ajaxCart(userTel, first)
          // 根据单选按钮改变设置总数量，全选，总价
          allCheck.checked = check.every(val => val.checked);

          const a = check.reduce((prev, val, idx) => {
            if (val.checked) {
              prev = prev + Num[idx].value * price[idx].innerText
            }
            return prev
          }, 0)
          // console.log(allPrice)
          sumPrice.innerText = a;
          sum.innerText = check.reduce((prev, val, idx) => {
            if (val.checked) {
              prev = Num[idx].value - 0 + prev
            }
            return prev;
          }, 0)
        }
        // 删除
        if (target.className === 'del') {
          const idx = target.index;
          removeArr(first, idx);
          const tr = [...o.$$('tbody tr')]
          tr[idx].remove();

          // 重新获取元素 删除了不会重新获取，添加索引

          const check = [...o.$$('.check')];
          const Num = [...o.$$('.Num')];
          const del = [...o.$$('.del')];
          const price = [...o.$$('.price')];
          check.forEach((val, idx) => { val.index = idx })
          Num.forEach((val, idx) => { val.index = idx })
          del.forEach((val, idx) => { val.index = idx })
          price.forEach((val, idx) => { val.index = idx })
          // 根据单选按钮改变设置总数量，全选，总价
          allCheck.checked = check.every(val => val.checked);

          const a = check.reduce((prev, val, idx) => {
            if (val.checked) {
              prev = prev + Num[idx].value * price[idx].innerText
            }
            return prev
          }, 0)
          // console.log(allPrice)
          sumPrice.innerText = a;
          sum.innerText = check.reduce((prev, val, idx) => {
            if (val.checked) {
              prev = Num[idx].value - 0 + prev
            }
            return prev;
          }, 0)
          ajaxCart(userTel, first)
        }
        if (target.className === 'Num') {
          const idx = target.index
          const num = Num[idx].value;
          const oneAllprice = [...o.$$('.oneAllprice')]
          oneAllprice[idx].innerText = num * price[idx].innerText;
          // 根据单选按钮改变设置总数量，全选，总价
          allCheck.checked = check.every(val => val.checked);

          const a = check.reduce((prev, val, idx) => {
            if (val.checked) {
              prev = prev + Num[idx].value * price[idx].innerText
            }
            return prev
          }, 0)
          // console.log(allPrice)
          sumPrice.innerText = a;
          sum.innerText = check.reduce((prev, val, idx) => {
            if (val.checked) {
              prev = Num[idx].value - 0 + prev
            }
            return prev;
          }, 0)
          ajaxCart(userTel, first)
        }





      })
    }
    )();
}
function removeArr(arr, a) {
  for (let i = a; i < arr.length; i++) {
    arr[i] = arr[i + 1]
  }
  arr.pop()
}